﻿@using BrnMall.Web.StoreAdmin.Models
@model BrnMall.Web.StoreAdmin.Models.WidgetConfigListModel

@section header{
    <title>首页定制-小程序网站</title>
    <link type="text/css" rel="stylesheet" href="/admin_store/css/site.css" />
    <script type="text/javascript" src="/admin_store/scripts/jquery.js"></script>
    <script type="text/javascript" src="/admin_store/scripts/jquery.validate.js"></script>
    <script type="text/javascript" src="/admin_store/scripts/jquery.validate.unobtrusive.js"></script>
    <link type="text/css" rel="stylesheet" href="/components/webuploader/webuploader.css" />
    <script type="text/javascript" src="/components/webuploader/webuploader.js"></script>
    <link href="/components/jbox/Skins/Default/jbox.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="/components/jbox/jquery.jBox-2.3.min.js"></script>
    <script type="text/javascript" src="/admin_store/scripts/showlist.js"></script>
    <script type="text/javascript" src="/components/my97datepicker/WdatePicker.js"></script>
    <script type="text/javascript" src="/admin_store/scripts/selectlist.js"></script>
    <script type="text/javascript">
        $(function () {
            var uploader = WebUploader.create({
                pick: '.uploadBut',
                auto: true,
                swf: '/components/webuploader/Uploader.swf',
                server: '/storeadmin/tool/upload?operation=uploadwidgetimage',
                fileVal: 'upload',
                accept: {
                    title: 'Images',
                    extensions: '@ViewData["allowImgType"]',
                    mimeTypes: '*'
                },
                fileSingleSizeLimit: @ViewData["maxImgSize"]
                });

            uploader.on('uploadProgress', function(file, percentage) {
                $(".uploadPreview").html("上传中...");
            });

            uploader.on('uploadSuccess', function(file, response) {
                var data = response._raw;
                if (data == "-1")
                    $(".uploadPreview").html('图片不能为空');
                else if (data == "-2")
                    $(".uploadPreview").html('图片类型不允许');
                else if (data == "-3")
                    $(".uploadPreview").html('图片太大');
                else {
                    $(".uploadPreview").html("<img src=\"@WorkContext.ImageCDN/upload/store/@WorkContext.StoreId/widget/" + data + "\"  />");
                    $("#ShowImg").val(data);
                }
            });

            uploader.on('uploadError', function(file) {
                $(".uploadPreview").html("上传失败");
            });
        });
    </script>

}

@section body{
    <h1 class="rightH1">
        小程序网站 > 首页定制 
        @if (Model.Code == "pc_index_nav")
        {
            <span> > <span class="rightH1-cur">网站导航</span></span>
        }
        @if (Model.Code == "pc_index_banner")
        {
            <span> > <span class="rightH1-cur">顶部轮播</span></span>
        }
        <div class="right">

            <div class="clear">
            </div>
        </div>
        <div class="clear">
        </div>
    </h1>
    <div class="table_top">
    </div>
    <div class="dataList">
        <table width="100%">
            <thead>
                <tr>
                    <th width="80" align="left">
                        编号
                    </th>
                    <th width="140" align="left">
                        标题
                    </th>
                    <th width="140" align="left">
                        展示图片
                    </th>
                    <th width="120" align="center">
                        链接类型
                    </th>
                    <th align="center">
                        链接对象
                    </th>
                    <th width="140" align="center">
                        排序
                    </th>
                    <th width="160" align="left">
                        管理操作
                    </th>
                </tr>
            </thead>
            <tbody>
                @foreach (WidgetConfigModel info in Model.Config)
                {
                    <tr>

                        <td>
                            @info.CId
                        </td>
                        <td>
                            @info.ShowName
                        </td>
                        <td>
                            <img height="40" width="40" src="@WorkContext.ImageCDN/upload/store/@WorkContext.StoreId/widget/@info.ShowImg" />
                        </td>
                        <td align="center">
                            @if (info.LinkType == "product")
                            {
                                <span class="mainimgspan">商品</span>
                            }
                            else if (info.LinkType == "store_class")
                            {
                                <span class="mainimgspan">店铺商品分类</span>
                            }
                            else if (info.LinkType == "news")
                            {
                                <span class="mainimgspan">内容</span>
                            }
                            else if (info.LinkType == "news_type")
                            {
                                <span class="mainimgspan">内容分类</span>
                            }
                            else if (info.LinkType == "page")
                            {
                                <span class="mainimgspan">关于我们</span>
                            }
                            else if (info.LinkType == "h5page")
                            {
                                <span class="mainimgspan">H5网页</span>
                            }
                            @*else if (info.LinkType == "phonecall")
                            {
                                <span class="mainimgspan">一键拨号</span>
                            }
                            else if (info.LinkType == "weappfunc")
                            {
                                <span class="mainimgspan">小程序功能</span>
                            }*@
                        </td>
                        <td align="center">
                            @if (info.LinkType == "h5page")
                            {
                                <span class="mainimgspan">@info.LinkValue.Url</span>
                            }
                            else
                            {
                                <span class="mainimgspan">@info.LinkValue.Name</span>
                            }
                        </td>
                        <td align="center">
                            <input type="text" url="@Url.Action("ChangeWidgetConfigSort", new {cid = info.CId})" value="@info.DisplayOrder" class="sortinput unselectedsortinput" />
                        </td>
                        <td>
                            <a href="@Url.Action("WidgetConfigList", new {cid = info.CId,code= Model.Widget.Code })" url="@Url.Action("WidgetConfigList", new {cid = info.CId,code= Model.Widget.Code })" }>修改</a>
                            <span class="btn-line">|</span>
                            <a href="#" url="@Url.Action("DeleteWidgetConfig", new {cid=info.CId})" class="ajaxdeleteOperate" }>删除</a>
                        </td>
                    </tr>
                }
            </tbody>
        </table>
    </div>
    <div class="table_bottom bg">
    </div>
    @using (Html.BeginForm("AddWidgetConfig", "PC"))
    {
        @Html.HiddenFor(x => x.Code)
        <div class="addTable">
            <table width="100%">
                <tbody>

                    <tr>
                        <td width="66px" align="right">标题：</td>
                        <td style="padding-left: 10px;"><input type="text" size="50" id="ShowName" name="ShowName" value="@Model.configModel.ShowName" /></td>
                    </tr>
                        <tr>
                            <td width="66px" align="right">展示图片：</td>
                            <td style="padding-left: 10px;">
                                <input type="hidden" name="WId" id="WId" value="@Model.Widget.WId" />
                                <div class="upload">
                                    <div class="uploadPreview">
                                        @if (Model.configModel.ShowImg != "")
                                        {
                                            <img src="@WorkContext.ImageCDN/upload/store/@WorkContext.StoreId/widget/@Model.configModel.ShowImg">
                                        }
                                        else
                                        {
                                            <span>暂无图片</span>
                                        }

                                    </div>
                                    <div class="left">
                                        <div class="uploadProgressBar"></div>
                                        <div class="uploadBut">选择图片</div>
                                    </div>

                                    <div class="clear"></div>
                                    <div class="left">@Model.UploadImageTips</div>
                                </div>
                                <input type="hidden" name="ShowImg" id="ShowImg" value="@Model.configModel.ShowImg" />
                            </td>
                        </tr>
                        <tr>
                            <td align="right">链接:</td>
                            <td style="padding-left: 10px;">
                                <table height="32">
                                    <tbody>
                                        <tr>
                                            <td>
                                                <select id="linktype" name="linktype" style="margin-right:10px;">
                                                    <option value="">选择分类</option>
                                                    <option value="product">商品</option>
                                                    <option value="store_class">店铺商品分类</option>
                                                    <option value="news">内容</option>
                                                    <option value="news_type">内容分类</option>
                                                    <option value="page">页面</option>
                                                    <option value="h5page">H5网页</option>
                                                </select>
                                            </td>
                                            <td>
                                                <div class="selectBt selectBox" id="selectProduct" style="display: none">
                                                    <input type="button" value="选择商品" class="btnProduct" onclick="openProductSelectLayer(this)" style="height: 22px; line-height: 22px; background: url(/admin_store/images/selectbgico.gif) no-repeat 6px center; padding-left: 22px; padding-right: 10px;">
                                                    <input type="hidden" class="Pid" id="Pid" name="Pid" value="" />
                                                    <input type="hidden" class="ProductName" id="ProductName" name="ProductName" value="" />
                                                </div>
                                                <div class="selectBt selectBox" id="selectStoreClass" style="display: none">
                                                    @Html.DropDownList("StoreClassId", Model.StoreClassList.Select(t => new SelectListItem() { Selected = false, Text = t.Name, Value = t.StoreCid.ToString() }), "选择店铺分类")
                                                </div>

                                                <div class="selectBt selectBox" id="selectNewsType" style="display: none">
                                                    @Html.DropDownList("NewsTypeId", Model.NewsTypeList.Select(t => new SelectListItem() { Selected = false, Text = t.Name, Value = t.NewsTypeId.ToString() }), "选择内容分类")
                                                </div>
                                                <div class="selectBt selectBox" id="selectNews" style="display: none">
                                                    <input type="button" value="选择内容" class="btnNews" onclick="openNewsSelectLayer(this)" style="height: 22px; line-height: 22px; background: url(/admin_store/images/selectbgico.gif) no-repeat 6px center; padding-left: 22px; padding-right: 10px;" />
                                                    <input type="hidden" class="NewsId" id="NewsId" name="NewsId" value="" />
                                                    <input type="hidden" class="NewsName" id="NewsName" name="NewsName" value="" />
                                                </div>
                                                <div class="selectBt selectBox" id="selectPageInfo" style="display: none">
                                                    <select id="PageInfoId" name="PageInfoId" class="valid">
                                                        <option value="" selected>选择页面</option>
                                                        <option value="2">关于我们</option>
                                                    </select>
                                                </div>
                                                <div class="selectBox" id="selectH5Page" style="display: none">
                                                    <input type="text" size="75" id="H5Page" name="H5Page" /><span>必须是http开头的网址</span>
                                                </div>
                                                <div class="selectBox" id="selectPhoneCall" style="display: none">
                                                    <input type="text" size="20" id="PhoneNumber" name="PhoneNumber" />
                                                </div>
                                                <div class="selectBt selectBox" id="selectFunctionCode" style="display: none">
                                                    @Html.DropDownList("FunctionCode", Model.FunctionCodes.Select(t => new SelectListItem() { Selected = false, Text = t.Name, Value = t.FunctionCode }), "选择小程序分类")
                                                </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>

                            </td>
                        </tr>
                        <tr>
                            <td align="right">排序：</td>
                            <td style="padding-left: 10px;"><input type="text" name="DisplayOrder" id="DisplayOrder" value="0" class="input" size="10" /></td>
                        </tr>
                        <tr>
                            <td align="right">是否显示:</td>
                            <td style="padding-left: 10px;">@Html.CheckBox("IsShow", true)</td>
                        </tr>
                        <tr>
                            <td align="right"></td>
                            <td>
                                @if (Model.configModel != null && Model.configModel.CId > 0)
                                {
                                    <input type="hidden" name="CId" value="@Model.configModel.CId" />
                                    <input type="image" id="addImg" style="margin: 0px; padding: 0px;" src="/admin_store/images/b.jpg" />
                                }
                                else
                                {
                                    <input type="hidden" name="CId" value="0" />
                                    <input type="image" id="addImg" style="margin: 0px; padding: 0px;" src="/admin_store/images/a.jpg" />
                                }
                                <script type="text/javascript">
                                    $(function(){
                                        loadLinkType();
                                    });
                                    $("#addImg").click(function() {
                                        if ($("#ShowName").val() === "") {
                                            alert("名称不能为空");
                                            return false;
                                        }
                                        if ($("#linktype").val() === "") {
                                            alert("链接不能为空");
                                            return false;
                                        }
                                        if ($("#ShowImg").val() == "") {
                                            alert("图片不能为空");
                                            return false;
                                        } else {
                                            $(this).parents("form").submit();
                                            return false;
                                        }
                                    })

                                    $("#linktype").change(function() {
                                        var sel = $(this).val();

                                        $(".selectBox").css("display", "none");
                                        if (sel === "product") {
                                            $("#selectProduct").css("display", "block");
                                        } else if (sel === "store_class") {
                                            $("#selectStoreClass").css("display", "block");
                                        } else if (sel === "news") {
                                            $("#selectNews").css("display", "block");
                                        } else if (sel === "news_type") {
                                            $("#selectNewsType").css("display", "block");
                                        } else if (sel === "page") {
                                            $("#selectPageInfo").css("display", "block");
                                        }else if (sel === "h5page") {
                                            $("#selectH5Page").css("display", "block");
                                        }
                                        else if (sel === "phonecall") {
                                            $("#selectPhoneCall").css("display", "block");
                                        }  else if (sel === "weappfunc") {
                                            $("#selectFunctionCode").css("display", "block");
                                        }
                                    });

                                    //加载链接类型
                                    function loadLinkType(){
                                        var linktype="@Model.configModel.LinkType";
                                        var sel=document.getElementById("linktype");
                                        for(var i=0;i<sel.options.length;i++){
                                            if(sel.options[i].value==linktype){
                                                sel.selectedIndex=i;
                                                $("#linktype").change();
                                                loadLinkValue();
                                            }
                                        }
                                    }

                                    function loadLinkValue(){
                                        var type="@Model.configModel.LinkType";
                                        var linkValue='@Model.configModel.LinkValue';
                                        if(linkValue=="")return;
                                        linkValue=JSON.parse(linkValue);

                                        if (type === "product") {
                                            $("#Pid").val(linkValue.Id);
                                            $("#ProductName").val(linkValue.Name);
                                            $(".btnProduct").val(linkValue.Name)
                                        } else if (type === "store_class") {
                                            var sel=$_2("StoreClassId");
                                            for(var i=0;i<sel.options.length;i++){
                                                if(sel.options[i].value==linkValue.Id)
                                                    sel.selectedIndex=i;
                                            }
                                        } else if (type === "news") {
                                            $("#NewsId").val(linkValue.Id);
                                            $("#NewsName").val(linkValue.Name);
                                            $(".btnNews").val(linkValue.Name)
                                        } else if (type === "news_type") {
                                            var sel=$_2("NewsTypeId");
                                            for(var i=0;i<sel.options.length;i++){
                                                if(sel.options[i].value==linkValue.Id)
                                                    sel.selectedIndex=i;
                                            }
                                        } else if (type === "page") {
                                            var sel=$_2("PageInfoId");
                                            for(var i=0;i<sel.options.length;i++){
                                                if(sel.options[i].value==linkValue.Id)
                                                    sel.selectedIndex=i;
                                            }
                                        }else if (type === "h5page") {
                                            $("#H5Page").val(linkValue.Url);
                                        }
                                        else if (type === "phonecall") {
                                            $("#PhoneNumber").val(linkValue.Name);
                                        }  else if (type === "weappfunc") {
                                            $("#weappfunc").val(linkValue.Name);
                                        }
                                        $("#DisplayOrder").val("@Model.configModel.DisplayOrder");
                                        var isShow= "@Model.configModel.IsShow";
                                        if(isShow=='True')
                                            $("#IsShow").attr("checked",true);
                                        else
                                            $("#IsShow").attr("checked",false);
                                    }

                                    function $_2(id){
                                        return document.getElementById(id);
                                    }
                                </script>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
                    }
                    }